<!DOCTYPE html>
<html lang="zh-CN" ng-app="index">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Edit Scope baseline</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
                              
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

    <style>

        #main-nav {
            margin-left: 1px;
        }

        #main-nav.nav-tabs.nav-stacked > li > a {
            padding: 10px 8px;
            font-size: 12px;
            font-weight: 600;
            color: #4A515B;
            background: #E9E9E9;
            background: -moz-linear-gradient(top, #FAFAFA 0%, #E9E9E9 100%);
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FAFAFA), color-stop(100%,#E9E9E9));
            background: -webkit-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
            background: -o-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
            background: -ms-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
            background: linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9')";
            border: 1px solid #D5D5D5;
            border-radius: 4px;
        }

        #main-nav.nav-tabs.nav-stacked > li > a > span {
            color: #4A515B;
        }

        #main-nav.nav-tabs.nav-stacked > li.active > a, #main-nav.nav-tabs.nav-stacked > li > a:hover {
            color: #FFF;
            background: #3C4049;
            background: -moz-linear-gradient(top, #4A515B 0%, #3C4049 100%);
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4A515B), color-stop(100%,#3C4049));
            background: -webkit-linear-gradient(top, #4A515B 0%,#3C4049 100%);
            background: -o-linear-gradient(top, #4A515B 0%,#3C4049 100%);
            background: -ms-linear-gradient(top, #4A515B 0%,#3C4049 100%);
            background: linear-gradient(top, #4A515B 0%,#3C4049 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4A515B', endColorstr='#3C4049');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#4A515B', endColorstr='#3C4049')";
            border-color: #2B2E33;
        }

        #main-nav.nav-tabs.nav-stacked > li.active > a, #main-nav.nav-tabs.nav-stacked > li > a:hover > span {
            color: #FFF;
        }

        #main-nav.nav-tabs.nav-stacked > li {
            margin-bottom: 4px;
        }

        /*定义二级菜单样式*/
        .secondmenu a {
            font-size: 10px;
            color: #4A515B;
            text-align: center;
        }

        .navbar-static-top {
            background-color: #212121;
            margin-bottom: 5px;
        }

        .navbar-brand {
            background: url('') no-repeat 10px 8px;
            display: inline-block;
            vertical-align: middle;
            padding-left: 50px;
            color: #fff;
        }

    </style>

</head>

<body>
    <!-- 顶部导航条-->

    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <!--<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">-->
                    <!--<span class="sr-only">Toggle navigation</span>-->
                    <!--<span class="icon-bar"></span>-->
                    <!--<span class="icon-bar"></span>-->
                    <!--<span class="icon-bar"></span>-->
                <!--</button>-->
                <a class="navbar-brand" href="./">Scopebaseline Tookit</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <!--<ul class="nav navbar-nav">-->
                    <!--&lt;!&ndash;<li class="active">&ndash;&gt;-->
                        <!--&lt;!&ndash;<a href="#"><span class="sr-only">(current)</span></a>&ndash;&gt;-->
                    <!--&lt;!&ndash;</li>&ndash;&gt;-->
                    <!--&lt;!&ndash;<li>&ndash;&gt;-->
                        <!--&lt;!&ndash;<a href="#">Link</a>&ndash;&gt;-->
                    <!--&lt;!&ndash;</li>&ndash;&gt;-->
                    <!--&lt;!&ndash;<li class="dropdown">&ndash;&gt;-->
                        <!--&lt;!&ndash;<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>&ndash;&gt;-->
                        <!--&lt;!&ndash;<ul class="dropdown-menu">&ndash;&gt;-->
                            <!--&lt;!&ndash;<li><a href="#">Action</a></li>&ndash;&gt;-->
                            <!--&lt;!&ndash;<li><a href="#">Another action</a></li>&ndash;&gt;-->
                            <!--&lt;!&ndash;<li><a href="#">Something else here</a></li>&ndash;&gt;-->
                            <!--&lt;!&ndash;<li role="separator" class="divider"></li>&ndash;&gt;-->
                            <!--&lt;!&ndash;<li><a href="#">Separated link</a></li>&ndash;&gt;-->
                            <!--&lt;!&ndash;<li role="separator" class="divider"></li>&ndash;&gt;-->
                            <!--&lt;!&ndash;<li><a href="#">One more separated link</a></li>&ndash;&gt;-->
                        <!--&lt;!&ndash;</ul>&ndash;&gt;-->
                    <!--&lt;!&ndash;</li>&ndash;&gt;-->
                <!--</ul>-->
                <form class="navbar-form navbar-left" role="search">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Search">
                    </div>
                    <button type="submit" class="btn btn-default">     <span class="glyphicon glyphicon-search"></span></button>
                </form>
                <ul class="nav navbar-nav navbar-right">

                    <li>
                        <a href="#" data-toggle="modal" data-target="#ops_record">操作记录 <span class="glyphicon glyphicon-time"></span></a>
                    </li>

                    <div class="modal fade" id="ops_record" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                        <div class="modal-dialog" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                    <h4 class="modal-title" id="myModalLabel"><h3>操作记录</h3></h4>
                                </div>
                                <div class="modal-body">

                                    <div >
                                        <div class="row">

                                            <div class="col-md-12">
                                                <h4><strong>操作时间:</strong></h4>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-12">
                                                <div name="dive" style="border: 1px deepskyblue solid"></div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <br>
                                            <div class="col-md-6">操作人: </div>
                                            <div class="col-md-6">操作记录ID: </div>
                                            <br>
                                        </div>
                                        <div class="row">
                                            <br>
                                            <div class="col-md-6">操作记录: </div>
                                            <div class="col-md-6">所属的scopebaselineID : </div>
                                            <br>
                                        </div>
                                        <br>
                                    </div>

                                    <div>
                                        <div class="row">

                                            <div class="col-md-12">
                                                <h4><strong>操作时间:</strong></h4>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-12">
                                                <div name="dive" style="border: 1px deepskyblue solid"></div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <br>
                                            <div class="col-md-6">操作人: </div>
                                            <div class="col-md-6">操作记录ID: </div>
                                            <br>
                                        </div>
                                        <div class="row">
                                            <br>
                                            <div class="col-md-6">操作记录: </div>
                                            <div class="col-md-6">所属的scopebaselineID : </div>
                                            <br>
                                        </div>
                                        <br>
                                    </div>

                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                    <button type="button" class="btn btn-primary">确定</button>
                                </div>
                            </div>
                        </div>
                    </div>

                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                        </ul>
                    </li>
                </ul>
            </div><!-- /.navbar-collapse -->
        </div><!-- /.container-fluid -->
    </nav>

    <!--<div class="navbar navbar-duomi navbar-static-top" role="navigation">-->
        <!--<div class="container-fluid">-->
            <!--<div class="navbar-header">-->
                <!--<a class="navbar-brand" href="/Admin/index.html" id="logo">配置管理系统（流量包月）-->
                <!--</a>-->
            <!--</div>-->
        <!--</div>-->
    <!--</div>-->
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-2">
                <ul id="main-nav" class="nav nav-tabs nav-stacked" style="">

                    <li>
                        <a href="#systemSetting" class="nav-header collapsed" data-toggle="collapse">
                            <i class="glyphicon glyphicon-cog"></i>
                            环境信息管理
                            <span class="pull-right glyphicon glyphicon-chevron-down"></span>
                        </a>
                        <ul id="systemSetting" class="nav nav-list collapse secondmenu" style="height: 0px;">

                            <li><a href="#"><span class="glyphicon glyphicon-eye-open"></span> testenv</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-eye-open"></span> TRE</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-eye-open"></span> AET_mobile</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-eye-open"></span> AET_cloud</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-eye-open"></span> Ali_Hangzhou</a></li>

                        </ul>
                    </li>

                    <li>
                        <a href="./plans.html">
                            <i class="glyphicon glyphicon-credit-card"></i>
                            scopebaseline 实例
                        </a>
                    </li>

                    <li>
                        <a href="./grid.html">
                            <i class="glyphicon glyphicon-globe"></i>
                            scopebaseline 规格
                            <span class="label label-warning pull-right">5</span>
                        </a>
                    </li>

                    <li>
                        <a href="./charts.html">
                            <i class="glyphicon glyphicon-calendar"></i>
                            图表统计
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <i class="glyphicon glyphicon-fire"></i>
                            关于系统
                        </a>
                    </li>

                </ul>
            </div>
            <div class="col-md-10">

                <div id="breadcrumb">
                    <ol class="breadcrumb">
                        <li><a href="#">Home</a></li>
                        <li><a href="#">scopebaseline</a></li>
                        <li class="active">scopebaseline详情</li>
                    </ol>
                </div>

                <div id="content" ng-view>
                    <!--something else-->
                </div>

                <div class="container" style="margin-top: 1%; width: 100%; height: 100%;" >

                    <div class="panel panel-default" ng-controller="EnvController">
                        <div class="panel-heading">
                            <h3>环境信息</h3>
                        </div>
                        <div class="panel-body">
                            <div class="row">
                                <label class="col-sm-3 text-right">环境名称:</label>
                                <div class="col-sm-8">

                                    <select class="form-control" ng-model="env" ng-options="env.env_name for env in env_list">
                                        <option></option>
                                    </select>
                                </div>

                            </div>
                            <div class="row">
                                <label class="col-sm-3 text-right">环境描述:</label>
                                <div class="col-sm-8">
                                    <textarea class="form-control" ng-model="env.description" disabled></textarea>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>

                <div class="container" style="margin-top: 1%; width: 100%; height: 100%;" >
                    <div class="panel panel-primary">
                        <div class="panel-heading"><h3>基线列表</h3></div>
                        <div class="panel-body">
                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <h4>BaseInfo</h4>
                                </div>
                                <div class="panel-body">
                                    <div class="row">
                                        <label class="col-sm-3 text-right">author name: </label>
                                        <div class="col-sm-8">
                                            <input type="text" class="form-control " ng-model="base_info.author" placeholder="please input author name" disabled><br>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-sm-3 text-right">creat time:</label>
                                        <div class="col-sm-8">
                                            <input type="datetime" class="form-control" placeholder="create time" ng-model="base_info.created_time" disabled><br>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-sm-3 text-right">version:</label>
                                        <div class="col-sm-8">
                                            <input type="text" class="form-control" ng-model="base_info.version" disabled><br>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-sm-3 text-right">CIMaturity:</label>
                                        <div class="col-sm-8">
                                            <select class='form-control'>
                                                <option>{{base_info.cimaturity}}</option>
                                                <option>{{cimaturity2}}</option>
                                                <option>{{cimaturity3}}</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="row"><br></div>
                                    <div class="row">
                                        <label class="col-sm-3 text-right">description:</label>
                                        <div class="col-sm-8">
                                            <textarea class="form-control" rows="3" placeholder="please input some description" ng-model="base_info.desc"></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <h4>Instance</h4>
                                </div>
                                <div class="panel-body">
                                    <div class="row">
                                        <h4 class="alert alert-info col-sm-6 col-sm-offset-3 text-center" ng-click="show_saas()"> SAAS</h4>
                                    </div>
                                    <div class="row">
                                        <table class="table table-hover table-striped table-responsive" ng-show="saas_table_state">
                                            <tr>
                                                <td>Name</td>
                                                <td>SpecVersion</td>
                                                <td>ReleaseNO</td>
                                                <td>BuildNO</td>
                                                <td>Branch</td>
                                                <td>QAMaturity</td>
                                            </tr>
                                            <tr ng-repeat="component in saas_com_list">
                                                <td>{{component.name}}</td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="component.spec_version"></td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="component.release_no"></td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="component.build_no"></td>
                                                <td>
                                                    <select class="form-control">
                                                        <option>{{component.branch}}</option>
                                                        <option>master</option>
                                                    </select>
                                                </td>
                                                <td>

                                                    <select class="form-control">
                                                        <option>{{component.qa}}</option>
                                                        <option>release</option>
                                                    </select>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>

                                    <div class="row">
                                        <h4 class="alert alert-info col-sm-6 col-sm-offset-3 text-center" ng-click="show_paas()">PAAS</h4>
                                    </div>
                                    <div class="row">
                                        <table class="table table-hover table-striped table-responsive" ng-show="paas_table_state">
                                            <tr>
                                                <td>Name</td>
                                                <td>SpecVersion</td>
                                                <td>ReleaseNO</td>
                                                <td>BuildNO</td>
                                                <td>Branch</td>
                                                <td>QAMaturity</td>
                                            </tr>
                                            <tr ng-repeat="component in paas_com_list">
                                                <td>{{component.name}}</td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="component.spec_version"></td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="component.release_no"></td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="component.build_no"></td>
                                                <td>
                                                    <select class="form-control">
                                                        <option>{{component.branch}}</option>
                                                        <option>master</option>
                                                    </select>
                                                </td>
                                                <td>
                                                    <select class="form-control">
                                                        <option>{{component.qa}}</option>
                                                        <option>release</option>
                                                    </select>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                    <div class="row">
                                        <h4 class="alert alert-info col-sm-6 col-sm-offset-3 text-center" ng-click="show_daas()">DAAS</h4>
                                    </div>
                                    <div class="row">
                                        <table class="table table-hover table-striped table-responsive" ng-show="daas_table_state">
                                            <tr>
                                                <td>Name</td>
                                                <td>SpecVersion</td>
                                                <td>ReleaseNO</td>
                                                <td>BuildNO</td>
                                                <td>Branch</td>
                                                <td>QAMaturity</td>
                                            </tr>
                                            <tr ng-repeat="d_component in daas_com_list">
                                                <td>{{d_component.name}}</td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="d_component.spec_version"></td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="d_component.release_no"></td>
                                                <td><input type="text" class="form-control" style="width: 60px;" ng-model="d_component.build_no"></td>
                                                <td>
                                                    <select class="form-control">
                                                        <option>{{d_component.branch}}</option>
                                                        <option>master</option>
                                                    </select>
                                                </td>
                                                <td>
                                                    <select class="form-control">
                                                        <option>{{d_component.qa}}</option>
                                                        <option>release</option>
                                                    </select>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
            </div>
        </div>
    </div>


      </div>
      <script src="js/base/jquery.min.js"></script>
      <script src="js/base/bootstrap.min.js"></script>
      <script src="js/base/angular.js"></script>
      <script src="js/app/index.js"></script>
      <script src="js/controller/index_controller.js"></script>

</body>
</html>

